<template>
	<view class="status-bar"></view>

	<view class="flex-ju-c bgfff pt30 pb15">
		<view class="size35 flex-a-i bold color999 center">
			<view @click="hometab(4)" :class="{activetxt:tindex==4}" class="mr30">
				关注
				<view :class="{active:tindex==4}" class="ra7 bgfff wh70-7"></view>
			</view>
			<view @click="hometab(0)" :class="{activetxt:tindex==0}" class="ml30">
				发现
				<view :class="{active:tindex==0}" class="ra7 bgfff wh70-7"></view>
			</view>
		</view>
	</view>


	<view class="mt15 pl10 pr10">
		<nodata v-if="isdata"></nodata>
		<view class="flex" style="justify-content: space-between;">
			<view>
				<view class="bgfff width48vw  mt15 pb15 posire"
					v-for="(item,index) in listleft" :key="index">
					<view class="posire" >
						<!-- 	<image mode="widthFix" v-if="item.imgs[0].path.endsWith('.mp4')"
						class="width40 posiab image right15 top15" src="/static/img/bo.png"></image> -->
						
					<video mode="widthFix" 
						 v-if="item.imgs[0].path.endsWith('.mp4')"
						class="width1000 height350 image" muted autoplay show-fullscreen-btn="false" controls="false" :src="item.imgs[0].path"></video>
						
					<image mode="widthFix" v-else class="width1000 image" :src="item.imgs[0].path"></image>
					
					
					<cover-view @click="navto('detail?id='+item.id)" style="height: 100%;" class="width1000   posiab top0 zindex1155">
						
					</cover-view>
					
					
					</view>
					
					<view class="con ">
						<view class="two  size29 bold mt15 mb15">{{item.title}}</view>
						<view class="flex-ju-b color666 size22">
							<view class="flex-a-i" v-if="item.user">
								<image mode="aspectFill" class="wh35-35 ra35 flex mr10"
									:src="item.user.avatar?item.user.avatar:'/static/mo.png'"></image>
								{{item.user.nickname}}
							</view>
							<view @click="setlike(item)" class="flex-a-i">
								<uni-icons v-if="item.is_like" type="heart-filled" color="#FF1E00"
									size="17"></uni-icons>
								<uni-icons v-else type="heart" color="#333" size="17"></uni-icons>
								{{item.like_count}}
							</view>
						</view>
					</view>
				</view>
			</view>

			<view>
				<view class="bgfff width48vw  mt15 pb15 posire"
					v-for="(item,indexs) in listright" :key="indexs">
					<view class="posire" >
						<!-- 	<image mode="widthFix" v-if="item.imgs[0].path.endsWith('.mp4')"
						class="width40 posiab image right15 top15" src="/static/img/bo.png"></image> -->
						
					<video mode="widthFix" 
						 v-if="item.imgs[0].path.endsWith('.mp4')"
						class="width1000 height350 image" muted autoplay show-fullscreen-btn="false" controls="false" :src="item.imgs[0].path"></video>
						
					<image mode="widthFix" v-else class="width1000 image" :src="item.imgs[0].path"></image>
					
					
					<cover-view @click="navto('detail?id='+item.id)" style="height: 100%;" class="width1000   posiab top0 zindex1155">
						
					</cover-view>
					
					
					</view>
					
					<view class="con ">
						<view class="two  size29 bold mt15 mb15">{{item.title}}</view>
						<view class="flex-ju-b color666 size22">
							<view class="flex-a-i" v-if="item.user">
								<image mode="aspectFill" class="wh35-35 ra35 flex mr10"
									:src="item.user.avatar?item.user.avatar:'/static/mo.png'"></image>
								{{item.user.nickname}}
							</view>
							<view @click="setlike(item)" class="flex-a-i">
								<uni-icons v-if="item.is_like" type="heart-filled" color="#FF1E00"
									size="17"></uni-icons>
								<uni-icons v-else type="heart" color="#333" size="17"></uni-icons>
								{{item.like_count}}
							</view>
						</view>
					</view>
				</view>
				
				 
			</view>

		</view>
	</view>
	<!-- <xun-upgrade></xun-upgrade> -->
</template>

<script>
		import uniIm from '@/uni_modules/uni-im/sdk/index.js';

	export default {
		data() {
			return {
				user:"",
				isdata: false,
				muted: true,
				duration: 3,
				tindex: 4,
				listleft: [],
				listright: [],
				page: 1
			}
		},
		mounted() {
			// this.$refs.upgrad.getversion()
		},
		computed: {
					unreadMsgCount() {
						return uniIm.conversation.unreadCount()
					}
				},
		watch: {
					unreadMsgCount: {
						handler(unreadMsgCount) {
							console.log("gffff")
							// #ifdef APP
							plus.runtime.setBadgeNumber(unreadMsgCount)
							// #endif
							if (unreadMsgCount == 0) {
								uni.removeTabBarBadge({
									index: 2,
									complete: (e) => {
										// console.log(e)
									}
								})
							} else {
								uni.setTabBarBadge({
									index: 2,
									text: unreadMsgCount + '',
									complete: (e) => {
										// console.log(e)
									}
								})
							}
		
						},
						immediate: true,
					}
				},
		onShow() {
			
		},
		async onLoad() {
			this.getlist(4)
			// await uniIm.conversation.loadMore()
			this.http('/api/userinfo').then(res => {
				this.user = res.data
				uni.setStorageSync('user', res.data)
			})
		},
		onReachBottom() {
			this.page++
			this.getlist(this.tindex)
		},
		methods: {
			getlist(type) {
				this.http('/api/note_list', {
					type,
					page: this.page,
					limit: 20
				}).then(res => {
					res.data.list.map((item, index) => {
						if (index % 2) {
							this.listright.push(item)
						} else {
							this.listleft.push(item)
						}
					})
					if (this.listleft.length) {
						this.isdata = false
					} else {
						this.isdata = true
					}
				}).catch(res=>{
					console.log(66666,res)
				})
			},
			setlike(item) {
				
				
				if (item.is_like) {
					this.http('/api/lose_like/' + item.id, {}, 'post').then(res => {
						item.is_like = false
						item.like_count--
					})
				}else{this.http('/api/post_like/' + item.id, {}, 'post').then(res => {
						item.is_like = true
						item.like_count++
					})
					
				}
					
			},
			hometab(index) {
				this.tindex = index
				this.listright = []
				this.listleft = []
				this.page = 1
				this.getlist(index)
			}
		}
	}
</script>

<style>
	page {
		background: #F6F7F8;
	}

	.active {
		background: #27A752;
	}

	.activetxt {
		color: #333;
	}
</style>